<%@page import="com.qdu.entity.Movie"%>
<%@page import="java.util.List"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>豆豆瓣-你心上的电影是哪一个</title>
        <link rel="stylesheet" href="css/bootstrap.min.css"/>
        <link rel="stylesheet" href="css/style.css"/>
        <link rel="shortcut icon" href="https://img3.doubanio.com/favicon.ico" type="image/x-icon">
    </head>
    <body>
        <div class="container">

            <br>
            <a href="index" class="home btn-warning">豆豆瓣</a>

            <hr>
            <div class="text-center">
                <h2>豆豆瓣-你的电影库</h2>
                <br>
                <form class="form-inline">
                    <input type="text" id="input_wd" name="keyword" class="form-control" placeholder="输入电影关键字">
                    <button type="submit" formaction="gnms1" id="searchBtn1" class="btn btn-info">检索1</button>
                    <!--如果发送ajax请求，请使用普通按钮，而不是提交按钮-->
                    <!--作业-请实现：点击“检索2”按钮发送ajax请求，根据关键字查询电影列表，显示在当前页面-->
                    <button id="searchBtn2" class="btn btn-danger">检索2</button>
                </form>
            </div>

            <br>
            <br>
            <br>
            <h3>最近热门电影</h3>
            <hr>
            <div class="movieGallery">
                <%
                    //获取请求对象中的属性all_movies，属性值是一个Movie对象列表
                    List<Movie> list = (List<Movie>) request.getAttribute("all_movies");
                    //遍历电影，每个电影用一个class为item的a元素显示，在对应的位置显示电影的对应信息即可
                    for (Movie m : list) {
                %>
                <a class="item" href="gmis?movieId=<%=m.getMovieId()%>">
                    <div>
                        <img src="images/<%=m.getMcover()%>" alt="<%=m.getMchineseName()%>">
                    </div>
                    <p>
                        <!--显示电影中文名和评分-->
                        <%=m.getMchineseName()%> [<%=m.getMrating()%>]
                    </p>
                </a>
                <%
                    }
                %>
            </div>
        </div>
    </body>
</html>
